

<!DOCTYPE html>

<!--
http://www.prepbootstrap.com/license

All the Templates and Themes on this website can be used under the MIT license, stated below. Some templates and themes can use third-party components and frameworks, that are subject to their own licenses.

Copyright (c) 2014 PrepBootstrap.com
Alterations made by abetusk

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

-->

<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MeowCAD</title>


    <!-- <link rel="stylesheet" type="text/css" href="/bootstrap/css/pastel-stream.css" /> -->
    <link rel="stylesheet" type="text/css" href="/bootstrap/css/bootstrap.css" />

    <link rel="stylesheet" type="text/css" href="/css/buttons.css" />
    <link rel="stylesheet" type="text/css" href="/css/forms.css" />
    <link rel="stylesheet" type="text/css" href="/css/tables.css" />
    <link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css" />

    <link rel="stylesheet" type="text/css" href="/css/uploadfile.css" />

    <script type="text/javascript" src="/js/meowmeow.js"></script>

    <script type="text/javascript" src="/js/jquery.js"></script>
    <script type="text/javascript" src="/bootstrap/js/bootstrap.js"></script>

    <!-- <script type="text/javascript" src="/js/fileHelper.js"></script> -->
    <script type='text/javascript' src='/js/jquery.form.js'></script>
    <script type='text/javascript' src='/js/jquery.uploadfile.js'></script>

    <script>

    var g_form_data = { "type" : "portfolio" };


//---------------------

      function initiateDownload( json_container )
      {
        var msg_type = json_container["type"];
        if (msg_type != "id")
        {
          console.log("error, expected id, got: " + msg_type);
          console.log(json_container);
          return;
        }

        // fiddle with iframe to send a download request
        //
        var id = json_container["id"];
        var ifrm = document.getElementById( "downloadFrame" );
        //ifrm.src = "bleepsixDownloadManager.py?id=" + id;

        url = "bleepsixDownloadManager.py?id=" + id;
        if ("name" in json_container)
        {
          url += '&name=' + json_container["name"]
        }
        ifrm.src = url;
      }


      function downloadProject( project_id  )
      {
        //var form_data = { "projectId" : "b9e179db-9102-4507-836e-abf7e1373494" };
        var form_data = { "projectId" : project_id };

        console.log(form_data);

        $.ajax({
          url: "downloadProject.py",
          type: 'POST',
          data: form_data,
          success: initiateDownload,
          error: function(jqxhr, status, err) { console.log(jqxhr); console.log(status); console.log(err); }

          });
      }

//--------------------

    $(document).ready( function() {

      meowmeow();

      // Drag and drop (and click to select) upload file functionality.
      //
      $("#multipleupload").uploadFile({
        url:"libmodImport.py",

        // "FIXING" IT
        //multiple:true,
        multiple: false,

        fileName:"fileData",

        //formData: { "type" : "portfolio" },
        formData: g_form_data,
        //fileData: { "type" : "portfolio" },

        //showStatusAfterSuccess:false,
        onSelect:function(files)
        {

          //THIS IS COMPLETELY FUCKING IDIOTIC
          // file upload doesn't have a 'feature' to specify the
          // file name uploaded.  This will set the global variable,
          // but will be re-used if multiple files get uploaded.
          // Instead, if there are multiple files uploaded,
          // then specifying the file array in the options variable
          // in jquery.fileupload.js will go through to the server
          // cgi script BUT ONLY IF THERE ARE MULTIPLE FILES FOR SOME
          // REASON.  So I have to make a fucking work around for this
          // fucking idiocy by fucking forcing the fucking file here,
          // in addition to stuffing it on the jqery.uploadfile end
          // and have the server fucking figure it out on the fucking
          // back end.  FUCKING FUCK!!!
          //
          // GOD DAMN IS THIS FUCKING STUPID
          //
          // AAAAAAAAAAAAAND NOPE!  Cause who fucking knows what's going on.
          // The "fix" is to allow only single file upload and be sure 
          // to reach around our ass and grab our elbow by setting the
          // FORCEDFILE field here.
          // 
          g_form_data["FORCEDFILE"] = files[0]["name"];

          console.log( g_form_data["FORCEDFILE"] )

          return true;
        },
        onSubmit:function(files)
        {
          $("#eventsmessage").html($("#eventsmessage").html()+"<br/>Submitting:"+JSON.stringify(files));

          console.log("submit");
        },
        onSuccess:function(files,data,xhr)
        {
          $("#eventsmessage").html($("#eventsmessage").html()+"<br/>Success for: "+JSON.stringify(data));

          console.log("success");
          
        },
        afterUploadAll:function()
        {
          $("#eventsmessage").html($("#eventsmessage").html()+"<br/>All files are uploaded");
          //$("#eventsmessage").html("<<br/>All files are uploaded");
          
          console.log("done?");
        },
        onError: function(files,status,errMsg)
        {
          $("#eventsmessage").html($("#eventsmessage").html()+"<br/>Error for: "+JSON.stringify(files));
        }
      });

    });

    </script>

</head>
<body>

  <iframe id='downloadFrame' style='display:none'></iframe>

  <!--NAVBAR-->

  <div class="container">

      <div class='row'>

        <div class='col-sm-4'>
          <h3 style='text-align:center; '>
            <i class='fa fa-coffee' style='opacity:0.5;' ></i>
          </h3>
        </div>

        <div class='col-sm-4'>
          <h3 style='text-align:center; margin-bottom:25px;'>Portfolio</h3>
        </div>

        <div class='col-sm-4'></div>

      </div>

        <!--BREADCRUMB-->
        <!--MESSAGE-->

        <!--not used for now...-->
        <!--PROJECT_FILES-->


        <div class='row' style='margin-top:25px'>
          <div class='col-lg-12'>
            <div class='panel panel-default'>

              <ul class='nav nav-tabs' style='margin-bottom: 15px;'>

                <li class='active'><a href='#PanelProjects' data-toggle='tab'>Projects</a></li>
                <!--PROJECT_CREATE_FORM_HEADER-->
                <!-- <li><a href='#PanelProjectCreate' data-toggle='tab'>New</a></li> -->
                <li><a href='#PanelComponent' data-toggle='tab'>Components</a></li>
                <li><a href='#PanelModule' data-toggle='tab'>Modules</a></li>
                <!--PROJECT_IMPORT_FORM_HEADER-->
                <!-- <li><a href='#PanelImport' data-toggle='tab'>Import</a></li> -->

              </ul>

              <div id='PaneTabContent' class='tab-content'>

                <div class='tab-pane active in' id='PanelProjects'>

                  <!--PROJECT_TABLE-->
                  
                </div>

                <!--PROJECT_CREATE_FORM-->


                <div class='tab-pane' id='PanelComponent'>

                  <div class='alert alert-info' style='margin:10px 10px;' >
                    <p style='text-align:center; margin-left:10px; margin-right:10px;' >
                      Components here will be inhereted by all projects unless overridden by components specific to a project.
                    </p>
                  </div>

                  <!--ACCORDIAN_COMPONENTS-->

                </div>


                <div class='tab-pane' id='PanelModule'>

                  <div class='alert alert-info' style='margin:10px 10px;' >
                    <p style='text-align:center; margin-left:10px; margin-right:10px;' >
                    Modules here will be inhereted by all projects unless overridden by modules specific to a project.
                    </p>
                  </div>

                  <!--ACCORDIAN_MODULES-->

                </div>

                <!--PROJECT_IMPORT_FORM-->

                <!--
                <div class='tab-pane' id='PanelImport'>
                </div>
                -->

              </div>

            </div>
          </div>
        </div>

        <!--FOOTER-->

    </div> <!-- container -->

  </body>
</html>

